<section [ngStyle]="tagData.cssStyle|styleFilter">
  <ng-container *ngFor="let item of tagData.data.data, let dataIndex = index">
    <div id="information{{dataIndex}}" class="information" [ngStyle]="item?.informationBoxCssStyle|styleFilter" [ngClass]="{'boxFlex': item.boxFlex !== undefined && (dataIndex + 2)%3 === 0}">
      <div class="informationMessage" [ngStyle]="item?.informationMessageBoxCssStyle|styleFilter">
        <div appDebounceClick (debounceClick)="go(item,dataIndex)" class="singleRow" [ngStyle]="item?.singleRowBoxCssStyle|styleFilter">
          <div class="imgBox" *ngIf="item.imageUrl" [ngStyle]="item?.imgBoxCssStyle|styleFilter">
            <ng-container *ngIf="item.imageUrl?.text">
              <img class="informationImg" *ngIf="item.imageUrl !== undefined" [src]="item.imageUrl?.text?.imgUrl"
                onerror="this.src='assets/img/default_img.png'"
                appDebounceClick (debounceClick)="previewImage($event,item.imageUrl,1,item.imageIsPreView,dataIndex)"
                [ngStyle]="item?.iconCssStyle|styleFilter">
            </ng-container>
            <ng-container *ngIf="!item.imageUrl?.text">
              <ng-container *ngIf="item.playIcon!==undefined; else isNotVideoTemplate">
                <img class="informationImg" *ngIf="item.imageUrl !== undefined" [src]="item.imageUrl"
                  onerror="this.src='assets/img/default_img.png'"
                  appDebounceClick (debounceClick)="watchVideo($event,item.imageUrl,item.imageIsPreView)"
                  [ngStyle]="item?.iconCssStyle|styleFilter">
              </ng-container>
              <ng-template #isNotVideoTemplate>
                <img class="informationImg" *ngIf="item.imageUrl !== undefined" [src]="item.imageUrl"
                  onerror="this.src='assets/img/default_img.png'"
                  appDebounceClick (debounceClick)="previewImage($event,item.imageUrl,1,item.imageIsPreView,dataIndex)"
                  [ngStyle]="item?.iconCssStyle|styleFilter">
              </ng-template>
            </ng-container>

            <ng-container *ngIf="item.playIcon!==undefined">
              <img class="playIcon" [src]="item.playIcon"
                onerror="this.src='https://zeno-img.oss-cn-shenzhen.aliyuncs.com/file_1668651291238cf2460baaadf0141e7461dba08f86e86.png'"
                appDebounceClick (debounceClick)="watchVideo($event,item.imageUrl,item.imageIsPreView)"
                [ngStyle]="item?.playIconCssStyle|styleFilter">
            </ng-container>
          </div>
          <div [ngClass]="{'noImageInformation': item.imageUrl === undefined}" class="informationRight">
            <div style="display: flex; flex-direction: column;justify-content: space-between;"
              [ngStyle]="item.topBoxCssStyle | styleFilter">
              <p class="fristClass" [ngStyle]="item.firstRowBoxCssStyle | styleFilter">
                <span class="fristClassTitle" [ngStyle]="item.titleCssStyle|styleFilter"
                  *ngIf="item.title">{{item.title}}</span>
                <span class="titleStatus"
                  *ngIf="item.titleRowRight?.firstText?.label && item.titleRowRight?.firstText?.label !== ''"
                  [ngStyle]="item.titleRowRight?.firstText?.cssStyle | styleFilter">{{item.titleRowRight.firstText.label}}</span>

                <span class="fristClassNew" *ngIf="item.tag && item.tag.label !== ''">{{item.tag.label}}</span>
                <ng-container *ngFor="let it of item.tags">
                  <span class="title-tag" [ngStyle]="it.cssStyle | styleFilter">{{it.label}}</span>
                </ng-container>
              </p>
              <p class="secondClass" [ngClass]="{'secondRowFenceLeft': item.secondRowFenceLeft}"
                [ngStyle]="item.secondRowBoxCssStyle | styleFilter">
                <span *ngIf="item.secondRowLeft && item.secondRowLeft.text"
                  [ngStyle]="item.secondRowLeft.cssStyle | styleFilter">{{item.secondRowLeft.text}}</span>
                <span *ngIf="item.secondRowFenceLeft" class="spText"
                  [ngStyle]="item.secondRowFenceLeft?.firstText?.cssStyle | styleFilter">{{item.secondRowFenceLeft?.firstText?.label}}
                  <div *ngIf="item.secondRowFenceLeft?.firstText?.hiddenSpLine===undefined" class="spLine"
                    [ngStyle]="item.secondRowFenceLeft?.firstText?.spLineCssStyle | styleFilter"></div>
                </span>
                <span *ngIf="item.secondRowFenceLeft" class="spText"
                  [ngStyle]="item.secondRowFenceLeft?.secondText?.cssStyle | styleFilter">{{item.secondRowFenceLeft?.secondText?.label}}
                  <div *ngIf="item.secondRowFenceLeft?.secondText?.hiddenSpLine===undefined" class="spLine"
                    [ngStyle]="item.secondRowFenceLeft?.secondText?.spLineCssStyle | styleFilter"></div>
                </span>
                <span *ngIf="item.secondRowFenceLeft" class="spText"
                  [ngStyle]="item.secondRowFenceLeft?.thirdText?.cssStyle | styleFilter">{{item.secondRowFenceLeft?.thirdText?.label}}
                  <div *ngIf="item.secondRowFenceLeft?.thirdText?.hiddenSpLine===undefined" class="spLine"
                    [ngStyle]="item.secondRowFenceLeft?.thirdText?.spLineCssStyle | styleFilter"></div>
                </span>
                <span *ngIf="item.secondRowFenceLeft" class="spText"
                  [ngStyle]="item.secondRowFenceLeft?.fourthText?.cssStyle | styleFilter">{{item.secondRowFenceLeft?.fourthText?.label}}
                  <div *ngIf="item.secondRowFenceLeft?.fourthText?.hiddenSpLine===undefined" class="spLine"
                    [ngStyle]="item.secondRowFenceLeft?.fourthText?.spLineCssStyle | styleFilter"></div>
                </span>
                <span class="floatRight"
                  *ngIf="item.secondRowRight && item.secondRowRight.text">{{item.secondRowRight.text}}</span>
                <span class="floatRight" *ngIf="item.secondRowRight && item.secondRowRight.tag"
                  [ngClass]="{'otherColor' : item.secondRowRight.tag.cssType !== 'orange',  'orangeColor' : item.secondRowRight.tag.cssType === 'orange'}">{{item.secondRowRight.tag.label}}</span>

                <!--新增tag-->
                <span *ngIf="item.tag1" [ngStyle]="item.tag1CssStyle | styleFilter">{{item.tag1}}</span>

                <span *ngIf="item.tag2" class="tag2Label"
                  [ngStyle]="item.tag2CssStyle | styleFilter">{{item.tag2}}</span>
              </p>
              <p class="thirdClass" [ngStyle]="item.thirdRowBoxCssStyle | styleFilter">
                <span *ngIf="item.thirdRowLeft && item.thirdRowLeft.text"
                  [ngStyle]="item.thirdRowLeft.cssStyle | styleFilter"><img class="thirdRowLeftImg"
                    *ngIf="item.thirdRowLeft && item.thirdRowLeft.icon" [src]="item.thirdRowLeft.icon"
                    onerror="this.src='assets/icon/list_icon_location@3x.png'">{{item.thirdRowLeft.text}}
                  <span *ngIf="item.thirdRowLeft?.text1"
                    [ngStyle]="item.thirdRowLeft.text1CssStyle | styleFilter">{{item.thirdRowLeft.text1}}</span>
                </span>
                <span class="floatRight"
                  *ngIf="item.thirdRowRight && item.thirdRowRight.tag && item.thirdRowRight.tag.label"
                  [ngStyle]="item.thirdRowRight?.tag?.cssStyle | styleFilter"
                  [ngClass]="{'otherColor' : item.thirdRowRight.tag.cssType !== 'orange', 'orangeColor' : item.thirdRowRight.tag.cssType === 'orange'}">{{item.thirdRowRight.tag.label}}</span>
              </p>
            </div>

          </div>
          <div class="fifthRow" *ngIf="item.fifthRowLeft" [ngStyle]="item.fifthRowLeft.box.cssStyle | styleFilter">
            <span *ngIf="item.fifthRowLeft&&item.fifthRowLeft.firstText"
              [ngStyle]="item.fifthRowLeft.firstText.cssStyle | styleFilter">{{item.fifthRowLeft.firstText.text}}</span>
            <span *ngIf="item.fifthRowLeft&&item.fifthRowLeft.phoneText"
              [ngStyle]="item.fifthRowLeft.phoneText.cssStyle | styleFilter"
              appDebounceClick (debounceClick)="copyStr($event,item.fifthRowLeft.phoneText.text)">{{item.fifthRowLeft.phoneText.text}}</span>


            <!--蜂喔商户1.6.15 新增添加案例按钮-->
            <div class="rightCommonButton">

              <button class="chatBtn" *ngIf="item.fifthRowLeft.chat"
                appDebounceClick (debounceClick)="gotoChat($event,item.fifthRowLeft.chat.customerUserId,item.fifthRowLeft.chat.customerNickName,item)">
                <img *ngIf="item.fifthRowLeft&&item.fifthRowLeft.chat" src="{{item.fifthRowLeft.chat.png}}"
                  [ngStyle]="item.fifthRowLeft.chat.cssStyle | styleFilter"
                  onerror="this.src='assets/fw/expert_icon_chat@3x.png'" />
              </button>

              <!--1.6.15 新增-->
              <span class="fifth-row-right-btn" *ngIf="item.fifthRowLeft?.addCase?.label"
                appDebounceClick (debounceClick)="newIconClick(item.fifthRowLeft.addCase,$event)"
                [ngStyle]="item.fifthRowLeft?.addCaseCssStyle|styleFilter">{{item.fifthRowLeft?.addCase?.label}}</span>
            </div>


          </div>
          <div class="fifthRow" *ngIf="item.fourthRowRight&&item.fourthRowLeft"
            [ngStyle]="item.fourthRowBoxCssStyle | styleFilter">
            <span *ngIf="item.fourthRowLeft&&item.fourthRowLeft.text"
              [ngStyle]="item.fourthRowLeft.cssStyle | styleFilter">{{item.fourthRowLeft.text}}</span>
            <span *ngIf="item.fourthRowRight&&item.fourthRowRight.text"
              [ngStyle]="item.fourthRowRight.cssStyle | styleFilter">{{item.fourthRowRight.text}}</span>
          </div>
          <!--蜂喔商户1.6.22 新增按钮行-->
          <div class="fifthRow" *ngIf="item.sixthRowLeft" [ngStyle]="item.sixthRowLeft.box.cssStyle | styleFilter">
            <span *ngIf="item.sixthRowLeft&&item.sixthRowLeft.firstText"
              [ngStyle]="item.sixthRowLeft.firstText.cssStyle | styleFilter">{{item.sixthRowLeft.firstText.text}}</span>
            <span *ngIf="item.sixthRowLeft&&item.sixthRowLeft.phoneText"
              [ngStyle]="item.sixthRowLeft.phoneText.cssStyle | styleFilter"
              appDebounceClick (debounceClick)="copyStr($event,item.sixthRowLeft.phoneText.text)">{{item.sixthRowLeft.phoneText.text}}</span>


            <!--蜂喔商户1.6.15 新增添加案例按钮-->
            <div class="rightCommonButton">

              <button class="chatBtn" *ngIf="item.sixthRowLeft.chat"
                appDebounceClick (debounceClick)="gotoChat($event,item.sixthRowLeft.chat.customerUserId,item.sixthRowLeft.chat.customerNickName,item)">
                <img *ngIf="item.sixthRowLeft&&item.sixthRowLeft.chat" src="{{item.sixthRowLeft.chat.png}}"
                  [ngStyle]="item.sixthRowLeft.chat.cssStyle | styleFilter"
                  onerror="this.src='assets/fw/expert_icon_chat@3x.png'" />
              </button>

              <!--1.6.15 新增-->
              <span class="fifth-row-right-btn" *ngIf="item.sixthRowLeft?.addCase?.label"
                appDebounceClick (debounceClick)="newIconClick(item.sixthRowLeft.addCase,$event)"
                [ngStyle]="item.sixthRowLeft?.addCaseCssStyle|styleFilter">{{item.sixthRowLeft?.addCase?.label}}</span>
            </div>


          </div>
        </div>
        <div class="fourClass" *ngIf="item.fourthRowLeft || item.fourthRowRight">
          <div class="fourthLeft" *ngIf="item.fourthRowLeft">
            <span *ngIf="item.fourthRowLeft.firstText && item.fourthRowLeft.firstText.childCss"
              [ngStyle]="item.fourthRowLeft.firstText.childCss">{{item.fourthRowLeft.firstText.label}}</span>
            <span
              *ngIf="item.fourthRowLeft.secondTest &&item.fourthRowLeft.secondTest.label && item.fourthRowLeft.secondTest.childCss"
              [ngStyle]="item.fourthRowLeft.secondTest.childCss">{{item.fourthRowLeft.secondTest.label}}</span>
            <span *ngIf="item.fourthRowLeft.firstTag && item.fourthRowLeft.firstTag.childCss"
              [ngStyle]="item.fourthRowLeft.firstTag.childCss">{{item.fourthRowLeft.firstTag.label}}</span>
            <span appDebounceClick (debounceClick)="openModalLink(item.fourthRowLeft?.link,item.fourthRowLeft?.secondTag?.label)"
              *ngIf="item.fourthRowLeft.secondTag && item.fourthRowLeft.secondTag.childCss"
              [ngStyle]="item.fourthRowLeft.secondTag.childCss">{{item.fourthRowLeft.secondTag.label}} <ng-container
                *ngIf="item.fourthRowLeft?.secondTag?.label==='业务中'||item.fourthRowLeft?.secondTag?.label==='签约中'"> >
              </ng-container>
            </span>
            <span
              *ngIf="item.fourthRowLeft.firstText && !item.fourthRowLeft.firstText.childCss">{{item.fourthRowLeft.firstText.label}}</span>
            <span
              *ngIf="item.fourthRowLeft.secondTest && !item.fourthRowLeft.secondTest.childCss">{{item.fourthRowLeft.secondTest.label}}</span>
            <span
              *ngIf="item.fourthRowLeft.firstTag && !item.fourthRowLeft.firstTag.childCss">{{item.fourthRowLeft.firstTag.label}}</span>
            <span appDebounceClick (debounceClick)="openModalLink(item.fourthRowLeft?.link,item.fourthRowLeft?.secondTag?.label)"
              *ngIf="item.fourthRowLeft.secondTag && !item.fourthRowLeft.secondTag.childCss">{{item.fourthRowLeft.secondTag.label}}
              <ng-container
                *ngIf="item.fourthRowLeft?.secondTag?.label==='业务中'||item.fourthRowLeft?.secondTag?.label==='签约中'"> >
              </ng-container>
            </span>
            <ng-container *ngIf="item.fourthRowLeft.thirdTag">
              <ng-container *ngFor="let v of item.fourthRowLeft.thirdTag.label?.split(';'); let i = index;">
                <span class="thirdTag"
                  [ngClass]="i === 0 ? item.fourthRowLeft.thirdTag.cssType : item.fourthRowLeft.thirdTag.cssType + 'Solid'">{{
                  v }}</span>
              </ng-container>
            </ng-container>

          </div>
          <div class="fourthRight" *ngIf="item.fourthRowRight &&  item.fourthRowRight.iconList">
            <span *ngFor="let icons of item.fourthRowRight.iconList, let i = index">
              <!-- 如更设置了最多显示数 -->
              <ng-container *ngIf="item.fourthRowRight.maxIconList && item.fourthRowRight.maxIconList > 1">
                <!-- 小于等于最多个全部显示 -->
                <span class="icon-label-bg"
                  *ngIf="item.fourthRowRight.iconList.length <= item.fourthRowRight.maxIconList">
                  <img appDebounceClick (debounceClick)="iconClick(icons,dataIndex)" src="{{icons.iconName}}">
                  <p *ngIf=" icons.iconLabel && icons.iconLabel.length > 0" class="icon-label">
                    {{icons.iconLabel}}
                  </p>
                </span>
                <!-- 大于3个 -->
                <span class="icon-label-bg"
                  *ngIf="item.fourthRowRight.iconList.length > item.fourthRowRight.maxIconList && i < item.fourthRowRight.maxIconList">
                  <!-- 显示2个+ 更多 -->
                  <img appDebounceClick (debounceClick)="iconClick(icons,dataIndex)" *ngIf="i < (item.fourthRowRight.maxIconList - 1)"
                    src="{{icons.iconName}}">
                  <p *ngIf="i < (item.fourthRowRight.maxIconList - 1) && icons.iconLabel && icons.iconLabel.length > 0"
                    class="icon-label">
                    {{icons.iconLabel}}
                  </p>
                  <!-- 更多 -->
                  <img appDebounceClick (debounceClick)="openIcon(item.fourthRowRight.iconList,dataIndex,item.fourthRowRight.maxIconList)"
                    *ngIf="i === (item.fourthRowRight.maxIconList - 1)"
                    src="assets/img/List operation_icon_more@3x.png">
                  <p *ngIf="i === (item.fourthRowRight.maxIconList - 1) && icons.iconLabel && icons.iconLabel.length > 0"
                    class="icon-label">
                    更多
                  </p>
                </span>
              </ng-container>
              <ng-container *ngIf="!item.fourthRowRight.maxIconList">
                <!-- 小于等于3个全部显示 -->
                <span class="icon-label-bg" *ngIf="item.fourthRowRight.iconList.length <= 3">
                  <img appDebounceClick (debounceClick)="iconClick(icons,dataIndex)" src="{{icons.iconName}}">
                  <p *ngIf=" icons.iconLabel && icons.iconLabel.length > 0" class="icon-label">
                    {{icons.iconLabel}}
                  </p>
                </span>
                <!-- 大于3个 -->
                <span class="icon-label-bg" *ngIf="item.fourthRowRight.iconList.length > 3 && i < 3">
                  <!-- 显示2个+ 更多 -->
                  <img appDebounceClick (debounceClick)="iconClick(icons,dataIndex)" *ngIf="i < 2" src="{{icons.iconName}}">
                  <p *ngIf="i < 2 && icons.iconLabel && icons.iconLabel.length > 0" class="icon-label">
                    {{icons.iconLabel}}
                  </p>
                  <!-- 更多 -->
                  <img appDebounceClick (debounceClick)="openIcon(item.fourthRowRight.iconList,dataIndex)" *ngIf="i === 2"
                    src="assets/img/List operation_icon_more@3x.png">
                  <p *ngIf="i === 2 && item.fourthRowRight.iconList.length > 3&& (icons.iconLabel && icons.iconLabel.length > 0 )"
                    class="icon-label">
                    更多
                  </p>
                </span>
              </ng-container>

            </span>
          </div>
        </div>
        <div class="remark-all top" *ngIf="item.remark">
          <div class="remark">
            <div class="text">{{item.remark}}</div>
          </div>
        </div>
        <div class="share-row-box" *ngIf="item.shareRow">
          <span class="share-row-head">分享到</span>
          <ng-container *ngFor="let j of item.shareRow.data;let index = index;">
            <ng-container *ngIf="index <= (item.shareRow.maxIcon - 1) ">
              <ng-container *ngIf="j.shareBtn">
                <img class="share-icon" [ngStyle]="{'margin-left':index===0?'0.75rem !important':'1.13rem !important' }"
                  [src]="j.shareBtn.iconName" appDebounceClick (debounceClick)="gotoSharePage(j.shareBtn)" />
              </ng-container>
              <ng-container *ngIf="!j.shareBtn">
                <img class="share-icon" [ngStyle]="{'margin-left':index===0?'0.75rem !important':'1.13rem !important' }"
                  [src]="j.shareIcon" appDebounceClick (debounceClick)="gotoSharePage(j)" />
              </ng-container>
            </ng-container>
          </ng-container>

          <!--超过数量则显示更多-->
          <ng-container *ngIf="item.shareRow?.data.length > item.shareRow?.maxIcon || item.shareRow?.iconList">
            <img class="share-icon" src="assets/laijian/share_icon_more@3x.png"
              appDebounceClick (debounceClick)="openShareModal(item.shareRow.iconList)" />
          </ng-container>
        </div>

        <ng-container *ngIf="tagData.style!==tagData.name">
          <div class="buttonBox1" [ngStyle]="item.buttonsCssStyle|styleFilter">

            <!--蜂喔商户1.6.22 新增完成时间-->
            <div class="leftLabel" [ngStyle]="item.buttonsLeftLabelCssStyle|styleFilter">
              <span class="finish-time" *ngIf="item.buttonsLeftText"
                [ngStyle]="item.buttonsLeftText?.cssStyle|styleFilter">{{item.buttonsLeftText?.text}}</span>
            </div>
            <div *ngIf="item.phone || item.buttonsRowLeft" class="moreButtons1"
              [ngStyle]="item.buttonsRowLeft?.btnCssStyle|styleFilter"
              appDebounceClick (debounceClick)="presentAlertConfirm(item.phone?.value,item.phone?.name)">
              <img class="phoneIcon" *ngIf="item.phone?.png" src="{{item.phone?.png}}"
                onerror="this.src='assets/fw/expert_icon_phone@3x.png'" />
              <ng-container *ngIf="item.buttonsRowLeft">
                <span class="title" *ngIf="item.buttonsRowLeft?.label"
                  [ngStyle]="item.buttonsRowLeft?.cssStyle|styleFilter">{{item.buttonsRowLeft?.label}}</span>
              </ng-container>
            </div>
            <div class="buttons 1" [ngStyle]="item.buttonsInnerCssStyle|styleFilter">
              <ng-container *ngFor="let btnItem of item.buttons">
                <span class="spanBtn" [ngStyle]="btnItem.cssStyle|styleFilter"
                  appDebounceClick (debounceClick)="normalBtnClick(btnItem,dataIndex)">{{btnItem.text}}</span>
              </ng-container>
            </div>
          </div>
        </ng-container>
        <ng-container *ngIf="tagData.style===tagData.name">
          <div class="buttonBox">
            <div class="moreButtons" appDebounceClick (debounceClick)="presentAlertConfirm(item.phone?.value,item.phone?.name)">
              <img class="phoneIcon" src="{{item.phone?.png}}"
                onerror="this.src='assets/fw/expert_icon_phone@3x.png'" />
            </div>
            <div class="buttons 2" [ngStyle]="item.buttonsInnerCssStyle|styleFilter">
              <ng-container *ngFor="let btnItem of item.buttons">
                <span class="spanBtn" [ngStyle]="btnItem.cssStyle|styleFilter"
                  appDebounceClick (debounceClick)="normalBtnClick(btnItem,dataIndex)">{{btnItem.text}}</span>
              </ng-container>
            </div>
          </div>
        </ng-container>

        <div class="lineStyle" *ngIf="item.noLineStyle === undefined"></div>
      </div>
    </div>
  </ng-container>

  <div *ngIf="openRemarks" class="remarksText">
    <div><textarea [(ngModel)]="remarksText" maxlength="remarksIcon.formData.textarea.maxLength"
        placeholder="{{remarksIcon.formData.textarea.placeholder}}"></textarea></div>
    <div appDebounceClick (debounceClick)="submitRemarks()" class="submit-btn">
      <p class="submit-btn-text">确定</p>
    </div>
  </div>
  <div class="noData" [ngStyle]="tagData.hintCssStyle|styleFilter"
    *ngIf="(tagData.data && tagData.data.data &&  tagData.data.data.length < 1)||(tagData.data && !tagData.data.data)">
    <span class="noData-span" [innerHTML]="emptyDataHint | parseStyle"></span>
  </div>
  <ion-infinite-scroll threshold="100px" (ionInfinite)="loadData($event)">
    <ion-infinite-scroll-content loadingSpinner="bubbles" loadingText="正在加载更多数据...">
    </ion-infinite-scroll-content>
  </ion-infinite-scroll>
</section>